/**
 * Copyright 2013 - Les petits mots
 */

/**
 * Initialise le premier jeu
 */
//Initialise le jeu des mots
function initGame(imageId,  level){
	// variable html des zone de drop
	var drop = "";
	// variable html des zone de drag
	var drag = "";
	//variable pour la medaille
	var medal = "";
	//division euclidienne par 2 sur la longueur du mot, pour connaitre le nombre de lettres a afficher (Level 1 et level 2)
	var cpt = Math.floor(words[imageId].letters.length/2) - 1;
	//Creation des zones de drag and drop et des medailles en fonction du level
	switch(level){
		case LEVEL_1 :
			drop = setDropList(imageId, cpt, true);
			drag = setDragList(words[imageId].letters.slice( cpt + 1 ));
			if(getItemProgression()) medal = "<span class=\"bronzeMedal\"></span>";
			break;
		case LEVEL_2 :
			drop = setDropList(imageId, cpt, false);
			drag = setDragList(words[imageId].letters.slice( cpt + 1 ));
			if(getItemProgression()) medal = "<span class=\"silverMedal\"></span>";
			break;
		case LEVEL_3 :
			drop = setDropList(imageId, -1, false);
			drag = setDragList(words[imageId].letters.slice(0));
			if(getItemProgression()) medal = "<span class=\"goldMedal\"></span>";
			break;
	}
	//append du code html
	appendGame(words[imageId].image_src, drag, drop, medal);
	//initialisation des evenement drag and drop
	setDragDropEvents();
}

/**
 * Génère les évènements liés au drag & drop pour le jeu
 */
function setDragDropEvents(){
	//Pour chaque lettre de l'alphabet
	for(letter in letters){
		//Eenement au click pour jouer la son de la lettre
		$("." + letters[letter]).click(function(event){
			playLetterSound(event.currentTarget.textContent);
		});
		//Evenement de drag pour la lettre
		$( "." + letters[letter] ).draggable({ revert: "invalid" });
		//Evenement de drop pour la lettre
	    $( ".droppable" + letters[letter] ).droppable({
	    	// la zone accepte uniquement cette lettre
	    	accept: "." + letters[letter],
	        hoverClass: "ui-state-active",
	        // En cas de drop valide
	        drop: function( event, ui ) {
	        	$(this).empty();
	        	//Suppression de la classe vide de la zone de drop
	        	$(this).removeClass("empty");
	        	//Recuperation du text droppe
	        	$(this).append(ui.draggable.text());
	        	//surppression des classes qui autorisent le drop
	        	$(this).droppable("option","accept","");
	        	ui.draggable.remove();
	        	
	        	check();
	        }
	      });
	}
}

/**
 * Vérifie si le jeu est résolus
 */
function check(){
	//Si la liste des lettres disponibles alors on a gagne
	  if($(".dragtable tr td").length == 0) {
		  if(typeof(Storage)!=="undefined")
		  {
			  gameComplete();
		  }
		  else
		  {
		  	alert("Local storage not supported");
		  }
		  $("#successGame1").click();
		  playSound();
		  if (navigator.userAgent.match(/(iPhone|iPod|iPad|Android|BlackBerry|IEMobile)/)) {
			  navigator.notification.vibrate(VIBRATING_DURATION);
		  }
	  }
}

/**
 * Mélange le contenu d'un tableau
 */
function shuffle(o){ 
    for(var j, x, i = o.length; i; j = Math.floor(Math.random() * i), x = o[--i], o[i] = o[j], o[j] = x);
    return o;
};

/**
 * Crée le squelette HTML du jeu
 */
function appendGame(image,drag,drop,medal){
	//On vide le contenun precedent et applique le nouveau
	$("#game1 [data-role=\"content-primary\"]").empty();
	$("#game1 [data-role=\"content-primary\"]").append("<img class=\"imagesGame1\" src=\"" +
			image +
			"\"></img><table class=\"dropLocation\"><tr>" +
			drop + (medal != '' ? '<td class="no-border">' + medal + "</td>" : '') +
			"</tr></table><table class=\"dragtable\"><tr>" +
			drag +
			"</tr></table>");
}

/**
 * Crée les cases à vide HTML à faire remplir par l'enfant
 */
function setDropList(imageId,offset,empty) {
	var drop = "";
	var letterStr = "";
	// creation d'une zone de drop td pour chaque lettre du mot
	for(var letter in words[imageId].letters){
		letterStr = words[imageId].letters[letter];
		if(letter <= offset){
			drop += "<td class=\"droppable" + letterStr + "\">" + letterStr + "</td>";
		}
		else {
			drop += "<td class=\"droppable" + letterStr + " empty\">" + (empty ? letterStr : "") + "</td>";
		}
	}
	return drop;
}

/**
 * Crée la liste HTML des lettres à remettre dans l'ordre 
 */
function setDragList(shuffleArray){
	var drag = "";
	var shuffleArray = shuffle(shuffleArray);
	// creation d'une zone de drag td pour chaque lettre du mot
	for(var letter in shuffleArray){
		drag += "<td class=\"" + shuffleArray[letter] + "\">" + shuffleArray[letter] + "</td>";
	}
	return drag;
}